<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
    <script>
    // 过滤
    
    // first()
    $('li').first()

    // last()
    $('li').last()

    // hasClass(class)
    $("div").click(function() {
        if ($(this).hasClass("protected") )
            $(this)
        .animate({left: -10})
        .animate({left: 10})
        .animate({left: -10})
        .animate({left: 10})
        .animate({left: 0});
    });

    // filter
    $("p").filter(".selected")

    $("p").filter(".selected, :first")

    $("p").filter(function(index) {
        return $("ol", this).length == 0;
    });

    // is
    $("input[type='checkbox']").parent().is("form")

    $("li").click(function() {
  var $li = $(this),
    isWithTwo = $li.is(function() {
      return $('strong', this).length === 2;
    });
  if ( isWithTwo ) {
    $li.css("background-color", "green");
  } else {
    $li.css("background-color", "red");
  }
});

    // 查找
    
    // children
    $("div").children()

    $("div").children(".selected")

    // closest
    $("li:first").closest(["ul", "body"]);

    $(document).bind("click", function (e) {
        $(e.target).closest("li").toggleClass("hilight");
    });

    // find
    $("p").find("span")

    // next
    $("p").next()

    $("p").next(".selected")

    // prev
    $("p").prev()

    $("p").prev(".selected")

    // prevAll
    $("div:last").prevAll().addClass("before");

    // prevUntil
    $('#term-2').prevUntil('dt').css('background-color','red');

</script>



</body>
</html>


